<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>OpenStreetMap</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <!--loads prototype-->
    <script src="prototype.js" type="text/javascript"></script>
    <script src="hotkeys.js" type="text/javascript"></script>

    <!--openLayers framework -->
    <script src="http://www.openlayers.org/api/OpenLayers.js" type="text/javascript"></script>
    <script src="Label.js" type="text/javascript"></script>
 
    <!-- bring in the OpenStreetMap OpenLayers layers -->
    <script src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js" type="text/javascript"></script>

    <!--load css -->
    <link rel=StyleSheet href="style.css" type="text/css">
    
    <!--Map script -->
    <script src="map.js" type="text/javascript"></script>

</head>
 

<body onload="init()"> <!-- loads map -->
    <div id="bodyDiv">
	<!-- Menu -->    	
	<div id="menuDiv" onclick="menu()">	
		<h2>Menu</h2>	
    	</div>    	
	<div id="dropDown">
    		<div id="waypoint" onclick="addWaypoint()"><h3>Set waypoint</h3></div>
		<div id="gps" onclick="toggleGPS()"><h3>GPS tracker</h3></div>
		<div id="oslo" onclick="oslo()"><h3>Oslo</h3></div>
    	</div>
	<div id="fadeDiv" onclick="removeMenu()">
	</div>
	<!-- div containing map -->   	
	<div id="map"></div>
	<div id="markerMenu">
		<p>	
			Description for marker: <input type="text" id="desc" name="desc" size="50" >
			<input type="button" value="Add waypoint" onclick="sendWaypoint()">
			<input type="button" value="Cancel" onclick="cancelWaypoint()" >	
		</p>
	</div>	
   </div>
</body>
 
</html>
